<template>
  <div class="search-container">
    <van-tabs v-model:active="activeTab">
      <van-tab title="个人信息查询">
        <van-form @submit="onSubmitPersonal">
          <van-cell-group inset>
            <van-field
              v-model="personalForm.phone"
              name="phone"
              label="手机号"
              placeholder="请输入手机号"
              :rules="[{ required: true, message: '请填写手机号' }]"
            />
            <van-field
              v-model="personalForm.name"
              name="name"
              label="姓名"
              placeholder="请输入姓名"
              :rules="[{ required: true, message: '请填写姓名' }]"
            />
            <van-field
              v-model="personalForm.idCard"
              name="idCard"
              label="身份证号"
              placeholder="请输入身份证号"
              :rules="[{ required: true, message: '请填写身份证号' }]"
            />
          </van-cell-group>
          <div style="margin: 16px;">
            <van-button round block type="primary" native-type="submit">
              查询
            </van-button>
          </div>
        </van-form>
      </van-tab>
      
      <van-tab title="单号查询">
        <van-form @submit="onSubmitNumber">
          <van-cell-group inset>
            <van-field
              v-model="numberForm.reportNumber"
              name="reportNumber"
              label="报告单号"
              placeholder="请输入报告单号"
              :rules="[{ required: true, message: '请填写报告单号' }]"
            />
          </van-cell-group>
          <div style="margin: 16px;">
            <van-button round block type="primary" native-type="submit">
              查询
            </van-button>
          </div>
        </van-form>
      </van-tab>
    </van-tabs>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { showToast } from 'vant'

const router = useRouter()
const activeTab = ref(0)

const personalForm = ref({
  phone: '',
  name: '',
  idCard: ''
})

const numberForm = ref({
  reportNumber: ''
})

const onSubmitPersonal = async (values) => {
  try {
    const res = await fetch('/api/keqiao/search/personal', {
      method: 'POST',
      body: JSON.stringify(values)
    })
    const data = await res.json()
    
    if (data.success) {
      router.push({
        path: '/keqiao/list',
        query: { type: 'personal', ...values }
      })
    } else {
      showToast(data.message || '查询失败')
    }
  } catch (error) {
    showToast('查询失败')
  }
}

const onSubmitNumber = async (values) => {
  try {
    const res = await fetch('/api/keqiao/search/number', {
      method: 'POST',
      body: JSON.stringify(values)
    })
    const data = await res.json()
    
    if (data.success) {
      router.push({
        path: '/keqiao/list',
        query: { type: 'number', ...values }
      })
    } else {
      showToast(data.message || '查询失败')
    }
  } catch (error) {
    showToast('查询失败')
  }
}
</script>

<style scoped>
.search-container {
  padding: 20px;
}
</style> 